body {
  background-color: white;
  padding: 0px;
  margin: 0px;
}

img {
  width: 250px;
  height: 400px;
  
}
img.blick:hover {
  opacity: 0.65;
  filter: alpha(opacity=65)
}
.test {
  display: none;
  width: 250px;
  height: 100%;
  margin: auto auto;
}


.spotlight-enter-active { animation: 3.5s spotlight reverse; }
/* .spotlight-leave-active { animation: 2s spotlight} */

@keyframes spotlight {
  0% { clip-path: circle(100% at 50% 50%); filter: blur(0px) }
  25% { clip-path: circle(25% at 50% 50%);filter: blur(1px) }

  40% { clip-path: circle(28% at 12% 84%);filter: blur(0px)}
  50% { clip-path: circle(28% at 12% 84%);filter: blur(2px)  }

  65% { clip-path: circle(25% at 75% 51%);filter: blur(0px) }
  75% { clip-path: circle(25% at 75% 51%);filter: blur(2px) }

  100% { clip-path: circle(20% at -30% 20%);filter: blur(0px); }
}

.wrapper_test {
  margin: 0 auto;
  top: 50%;
  transform: translateY(-50%);
  display: block;
  position: absolute;
  width: 100%;
}

.component {
  width: 100%;
  height: 720px;
}